import React, { useContext } from 'react';
import classNames from 'classnames';
import { SlotContext } from '@/components/SlotView/components/SlotProvider';

interface SlotProps {
  name: string;
  className?: string;
}

export function Slot({ name, className }: SlotProps) {
  const slots = useContext(SlotContext);

  const content = slots[name] || null;

  return <div className={classNames(className, `slot-${name}`)}>{content}</div>;
}
